import Vue from 'vue'; 
import Toast from './Toast.vue'; //引入组件 
let ToastConstructor = Vue.extend(Toast) // 返回一个“扩展实例构造器” 
  
var plugin = {}
plugin.install = (Vue, option) => {
  Vue.prototype.$toast = (text, duration) => {
    var ToastClass = Vue.extend(Toast)
    var ToastCom = new ToastClass()
    ToastCom.text = text;
    // ToastCom.time = time;
    // ToastCom.isShow = isShow;
    var Dom = ToastCom .$mount().$el
    document.body.appendChild(Dom)
    // setTimeout(() => {
    //     ToastCom.isShow = false;
    // }, duration);
  }
}

export default plugin

//不起作用
// let myToast = (text)=>{ 
//     let toastDom = new ToastConstructor({
//         el: document.createElement("div")
//     });
//     toastDom.text = text;
//     document.body.appendChild( toastDom.$el ) //把toast组件的dom添加到body里 
//     console.log("toastDom", toastDom);
// } 
// export default myToast;

// Vue.component("my-message", {
//     render: function(createElement){
//         return createElement(
//             "div",
//             [
//                 createElement(
//                     "div",
//                     {
//                         class: {
//                             "header": true
//                         },
//                         style: {
//                             width: "100%",
//                             background: "red"
//                         }
//                     },
//                     [
//                         createElement("span", "对话框标题")
//                     ]
//                 ),
//                 createElement(
//                     "div",
//                     {
//                         class: {
//                             "body": true
//                         },
//                         style: {
//                             background: "green"
//                         }
//                     },
//                     [
//                         createElement("span", "对话框主体")
//                     ]
//                 ),
//                 createElement(
//                     "div",
//                     {
//                         class: {
//                             "footer": true
//                         },
//                         style: {
//                             background: "yellow"
//                         }
//                     },
//                     [
//                         createElement(
//                             "span",
//                             "对话框底部"
//                         )
//                     ]
//                 )
//             ]
//         );
//     }
// });